<template>
	
	<view class="content">
		<view class="top">
			
		</view>
		<view class="info">
			<view class="info-card">
				<view class="info-card-left">
					<view class="info-card-name">
						选择权益卡
					</view>
					<view class="info-card-num">
						<text class="info-card-leble">权益卡：</text>
						<text  class="info-card-nbrum">PI05************59891</text>
					</view>
				</view>
				<view class="info-card-right">
					<image src="/static/order/right.png" ></image>
				</view>
			</view>
			
			<view class="info-fw">
				<view class="info-fw-title">
					选择服务
				</view>
				
				<view class="info-fw-list">
					<view class="info-fw-list-item">
						<image src="/static/order/imfw.png" ></image>
						<view class="info-fw-list-item-title">
							宠物洗澡
						</view>
						<view class="info-fw-list-item-select">
							<u-checkbox-group>
								<u-checkbox v-model="checked" shape="circle"></u-checkbox>
							</u-checkbox-group>
						</view>
					</view>
					
				</view>
				
			</view>
			
			
		</view>
	</view>
</template>

<script>
// import { BASE_URL_IMAHE } from "../../../../utils/https";
// 	import { getServiceProtocol } from "@/api/service";
	export default {
	  name: "serviceindex",
	  data() {
		  return {
			
			checked:false,
			
		  }
	  },
	  onLoad(options) {
		  // console.log(JSON.parse(options.item))
		
			
		
	  },
	  onReady() {
		  
	  		
	  	},
			
		methods:{
		}
	}
	  
</script>

<style scoped lang="scss">
		
	.top{
		width: 752rpx;
		height: 128rpx;
		background: linear-gradient(360deg, rgba(255,255,255,0.1) 3%, rgba(250,185,171,0.1) 16%, #F9603D 100%);
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		opacity: 1;
	}
	.info{
		width: 697rpx;
		height: auto;
		background: #FFFFFF;
		opacity: 1;
		margin: -70rpx auto 0;
		border-radius: 25rpx;
		.info-card{
			display: flex;
			justify-content: space-between;
			margin: 0 auto;
			width: 673rpx;
			align-items: center;
			padding: 82rpx 30rpx 18rpx;
			box-sizing: border-box;
			border-bottom: 1rpx solid #BFBFBF;
			.info-card-left{
				.info-card-name{
					font-size: 33rpx;
					color: #000000;
					line-height: 46rpx;
				}
				.info-card-num{
					margin-top: 15rpx;
					.info-card-leble{
						font-size: 25rpx;
						color: #7F7E7E;
						line-height: 35rpx;
					}
						
					.info-card-nbrum{
						font-size: 25rpx;
						color: #3A3A3A;
						line-height: 35rpx;
					}
				}
			}
			.info-card-right{
				image{
					width: 29rpx;
					height: 32rpx;
				}
			}
		}
		.info-fw{
			margin-top: 31rpx;
			.info-fw-title{
				font-size: 25rpx;
				color: #000000;
				line-height: 35rpx;
				margin-left: 28rpx;
			}
			.info-fw-list{
				margin-top: 12rpx;
				padding:0 38rpx;
				display: flex;
				justify-content: space-between;
				flex-wrap: wrap;
				.info-fw-list-item{
					width: 299rpx;
					height: 192rpx;
					margin-bottom: 37rpx;
					position: relative;
					image{
						width: 100%;
						height: 100%;
					}
					.info-fw-list-item-title{
						position: absolute;
						top: 21rpx;
						left: 22rpx;
						font-size: 33rpx;
						color: #000000;
						line-height: 46rpx;
					}
					.info-fw-list-item-select{
						position: absolute;
						top: 20rpx;
						left: 247rpx;
					}
				}
				
			}
		}
	}
	
</style>